<!--  -->
<template>
  <div class='vieDetail'>
    <el-dialog
      title="查看楼层信息"
      :visible.sync="dialogVisible"
      width="50%"
      :before-close="handleClose"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
    >
      <avue-crud
        ref="crud"
        :data="tableData"
        :table-loading="tableLoading"
        :option="tableOptionForm"
        @refresh-change="refreshChange"
      >
        <template
          slot="menuLeft"
          slot-scope="scope"
        >
          <el-button
            class="filter-item"
            type="primary"
            icon="el-icon-plus"
            @click="addOrUpdateHandle('add','')"
          >
            新增
          </el-button>
        </template>
        <template
          slot="menu"
          slot-scope="scope"
        >
          <!-- <el-button
            type="text"
            icon="el-icon-edit"
            @click="addOrUpdateHandle('edit',scope.row)"
          >
            编辑
          </el-button> -->
          <el-button
            type="text"
            @click="handleDelete(scope.row,scope.index)"
          >
            清除
          </el-button>
        </template>
      </avue-crud>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button
          @click="dialogVisible = false"
          icon='el-icon-circle-close'
        >取 消</el-button>
        <el-button
          icon='el-icon-circle-check'
          type="primary"
          @click="dialogVisible = false"
        >确 定</el-button>
      </span>
      <view-add
        ref="viewAdd"
        @getList="getList"
      ></view-add>
    </el-dialog>
  </div>
</template>

<script>
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
// 例如：import 《组件名称》 from '《组件路径》';
import { tableOptionForm } from '@/const/crud/market/meter/setting/privateSetting/person'
import { FloorSettings, deleteFloorProject } from '@/api/market/meter/setting/privateSetting/person'
import viewAdd from './viewAdd'
export default {
  // import引入的组件需要注入到对象中才能使用
  components: { "view-add": viewAdd },
  data () {
    // 这里存放数据
    return {
      dialogVisible: false,
      tableOptionForm: tableOptionForm,
      tableLoading: false,
      tableData: [],
      item: {},
      id: '',
      parentId: ''
    }
  },
  // 监听属性 类似于data概念
  computed: {},
  // 监控data中的数据变化
  watch: {},
  // 方法集合
  methods: {
    handleDelete (row) {
      this.$confirm('是否确认清除此条数据？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteFloorProject({ id: row.id }).then(res => {
          if (res.data.data) {
            this.getList()
            this.$message.success("清除成功")
          } else {
            this.$message.success("清除失败")
          }
        })
      }).catch(() => {

      })

    },
    addOrUpdateHandle (method, id) {
      this.$refs.viewAdd.init(method, id, this.item, this.parentId)
    },
    handleClose () {
      this.dialogVisible = false
    },
    init (method, id, item, parentId) {
      this.item = item
      this.id = id
      this.parentId = id
      this.getList()
      this.dialogVisible = true
    },
    getList () {
      FloorSettings({ id: this.id }).then(res => {
        this.tableData = res.data.data
      })
    },
    refreshChange () {
      this.getList()
    }
  },
  // 生命周期 - 创建完成（可以访问当前this实例）
  created () {

  },
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted () {

  },
  beforeCreate () { }, // 生命周期 - 创建之前
  beforeMount () { }, // 生命周期 - 挂载之前
  beforeUpdate () { }, // 生命周期 - 更新之前
  updated () { }, // 生命周期 - 更新之后
  beforeDestroy () { }, // 生命周期 - 销毁之前
  destroyed () { }, // 生命周期 - 销毁完成
  activated () { } // 如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类
</style>